.RandomArticleComponent {
    .item {
        background-size: 100%;

        // 鼠标经过效果
        &:hover {
            background-size: 105%;
        }

        &:nth-of-type(1) .ranking {
            background-color: #f83356;

            &::after {
                border-color: transparent transparent transparent #f83356;
            }
        }

        &:nth-of-type(2) .ranking {
            background-color: #faa527;

            &::after {
                border-color: transparent transparent transparent #faa527;
            }
        }

        &:nth-of-type(3) .ranking {
            background-color: #3c83fd;

            &::after {
                border-color: transparent transparent transparent #3c83fd;
            }
        }

        &:nth-of-type(4) .ranking {
            background-color: #56c357;

            &::after {
                border-color: transparent transparent transparent #56c357;
            }
        }

        &:nth-of-type(5) .ranking {
            background-color: #6756c3;

            &::after {
                border-color: transparent transparent transparent #6756c3;
            }
        }
    }
}